<script setup>
    const count = ref(1)

    const hello = ref(null)

    console.log('setup......')

    onBeforeMount(() => {
        console.log('onBeforeMount......')
    })
    onMounted(() => {
        console.log('onMounted......')
        console.log(hello.value) // DOM元素
    })
    onBeforeUpdate(() => {
        console.log('onBeforeUpdate......')
    })
    onUpdated(() => {
        console.log('onUpdated......')
    })
    onBeforeUnmount(() => {
        console.log('onBeforeUnmount......')
    })
    onUnmounted(() => {
        console.log('onUnmounted......')
    })
</script>

<template>  
    <p ref="hello">{{ count }}</p>
    <button @click="count++">修改count</button>
</template>

<style scoped>

</style>